<template>
  <div>
    <component :is="one"></component>

    <div id="container">
      <div id="content2">
        <table width="100%" height="41" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="15" height="18" align="left" valign="top">
              <div align="left"></div>
            </td>
            <td width="385" align="left" valign="bottom" class="12">&nbsp;</td>
          </tr>
          <tr>
            <td height="4" colspan="2" align="left" valign="bottom"></td>
          </tr>
          <tr>
            <td height="15" align="left" valign="top">&nbsp;</td>
            <td height="15" align="left" valign="top" class="12">
              <table width="100%" height="20" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td height="20">
                    <div class="right_proaducts">我的位置&gt;&gt;科技项目申报&gt;添加用户<br />
                      <br />
                    </div>
                    <!--              <form action="../admin/admin_index.html" method="post" id="form">-->
                    <!--                  <DIV class=padding>
                    <DIV id=middlebody>-->
                    <table cellspacing="0" cellpadding="0" width="100%" border="0">
                      <tbody>
                        <tr>
                          <td>
                            <div align="left">|&nbsp;&nbsp;欢迎,admin&nbsp;&nbsp;|&nbsp;&nbsp;
                              <a class="table_t" href="#/">注销      </a>&nbsp;&nbsp;|&nbsp;&nbsp;
                              <a href="javascript:history.go(-1)">后退</a>&nbsp;&nbsp;|
                            </div>
                          </td>
                          <td>
                            <div align="center"><a href="#/admin/showusers">登录用户管理</a>
                            </div>
                          </td>
                          <td>
                            <div align="center"><a href="#/admin/showexperts">专家信息管理</a>
                            </div>
                          </td>
                          <td height="50">
                            <div align="center"><a href="#/admin/showunits">单位信息管理</a>
                            </div>
                          </td>
                          <td>
                            <div align="center"><a href="#/admin/showprojectCategorys">项目管理</a>
                            </div>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                    <table id="app" width="300" border="0" align="center" cellpadding="0" cellspacing="1" class="mars">
                      <tbody>
                        <tr bgcolor="#fba661" height="30">
                          <td width="102" height="20" bgcolor="#f3f3f3">
                            <div align="center">用户名</div>
                          </td>
                          <td height="20" colspan="2" align="left" bgcolor="#f3f3f3">
                            <div align="left">
                              <input type="text" name="username" v-model="user.username" />
                            </div>
                          </td>
                        </tr>
                        <tr bgcolor="#e4f1fe">
                          <td height="20" bgcolor="#f3f3f3">
                            <div align="center">权限组</div>
                          </td>
                          <td height="20" colspan="2" align="left" bgcolor="#f3f3f3">
                            <div align="left">
                              <select name="select" size="1" v-model="user.gid">
                                <option value="2">专家</option>
                                <option value="3">单位</option>
                              </select>
                            </div>
                          </td>
                        </tr>
                        <tr bgcolor="#e4f1fe">
                          <td height="30" bgcolor="#f3f3f3">&nbsp;</td>
                          <td width="60" height="30" align="left" bgcolor="#f3f3f3">
                            <!--					  <input type="submit" name="Submit" value="提交" onclick="return checkUser(form)"/>-->
                            <button @click="addUser()">提交</button>
                          </td>
                          <td width="134" height="30" align="left" bgcolor="#f3f3f3">
                            <input type="reset" name="Submit2" value="取消" />
                          </td>
                        </tr>
                      </tbody>
                    </table>
                    <div></div>
                    <!--              </form>-->
                  </td>
                </tr>
              </table>
              <br />
              <div class="table_wz"></div>
            </td>
          </tr>
        </table>
      </div>
    </div>

    <component :is="two"></component>
  </div>
</template>
<script>
  import four from '../../util/four';
  import aaa from '@/components/header.vue'
  import bbb from '@/components/footer.vue'
  const options = {
    data() {
      return {
        one: 'aaa',
        two: 'bbb',
        user: {
          gid: "2",
          username: "",
          password: "1234"
        },
      }
    },
    components: {
      aaa, bbb
    },
    methods: {
      addUser() {
        if (this.user.username != "") {
          four.post("/users", this.user).then((res) => {
            if (res.data.code == 20011) {
              this.$message.success("添加成功！");
            }
            if (res.data.code == 20010) {
              this.$message.error("添加失败！");
            }
          }).finally(() => {
            //跳转页面
            this.$router.push('/admin/showusers')
          })
        } else {
          this.$message.error("用户名不能为空！");
        }
      },
      reset() {
        this.user.username = "";
      }
    }
  }
  export default options;
</script>
